<template>
  <!-- 处理措施1 -->
  <div v-if="thisDiv === 3">
    <table>
      <slot name="left"/>
      <tr>
        <td class="td-title">无介入</td>
        <td>
      <span v-if="formData.baqsjRecordHandle.nonInvolved === '102'">
        其他（{{ formData.baqsjRecordHandle.nonInvolvedOther || '' }}）
      </span>
          <span v-else>
        {{ getNoIntervention(formData.baqsjRecordHandle.nonInvolved) || '' }}
      </span>
        </td>
      </tr>
      <slot name="right"/>
    </table>
  </div>
  <div v-else style="display: flex; width: 100%; flex-wrap: wrap; ">
    <slot name="left"/>
    <el-form-item label="无介入" prop="nonInvolved">
      <el-radio-group v-model="formData.baqsjRecordHandle.nonInvolved">
        <el-radio v-for="(item, index) in noInterventionList" :key="index" :label="item.value">{{ item.label }}</el-radio>
      </el-radio-group>
      <el-input
        v-if="formData.baqsjRecordHandle.nonInvolved && formData.baqsjRecordHandle.nonInvolved === '102'"
        :style="{ width: '200px' }"
        placeholder="请输入"
        v-model="formData.baqsjRecordHandle.nonInvolvedOther"
      />
    </el-form-item>
    <div style="width: 100%" />
    <slot name="right"/>
  </div>
</template>

<script>
export default {
  props: {
    formData: {
      type: Object,
      default: () => ({})
    },
    thisDiv: {
      type: Number,
      default: 1
    }
  },
  data() {
    return {
      noInterventionList: [
        { value: '100', label: '无需任何处理' },
        { value: '101', label: '病人拒绝处置' },
        { value: '102', label: '其他' }
      ]
    }
  },
  methods: {
    getNoIntervention(value) {
      const item = this.noInterventionList.find(item => item.value === value)
      return item ? item.label : value
    }
  }
}
</script>
<style scoped>
table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
  table-layout: fixed;
}
td {
  border: 1px solid #ccc;
  padding: 10px;
  text-align: left;
  /* 调整行间距 */
  line-height: 1.6;
  /* 调整字体大小 */
  font-size: 18px;
  /* 调整字间距 */
  letter-spacing: 0.5px;
}

.td-title {
  width: 12%;
  background-color: #fff;
}
</style>
